<template>
	<div class="product-add">
		<!--form表单-->
		<el-form size="small" ref="form" :model="form" label-width="250px">
			<!--小程序设置-->
			<div class="common-form">分享设置</div>

			<el-form-item label="分享落地页">
				<el-radio v-model="form.type" :label="1">公众号/h5</el-radio>
				<el-radio v-model="form.type" :label="2">小程序</el-radio>
				<el-radio v-model="form.type" :label="3">下载页</el-radio>
				<div class="tips">1、公众号和小程序跳到app对应的分享页面，下载页需要自己编写或者跳第三方;2、小程序仅支持分享到微信好友;</div>
			</el-form-item>
			<template v-if="form.type == 1">
				<el-form-item label="公众号/h5对应的访问路径">
					<el-input v-model.trim="form.open_site" class="max-w460"></el-input>
					<div class="tips">如果未修改默认部署，则为https://域名/h5</div>
				</el-form-item>
			</template>
			<template v-if="form.type == 2">
				<el-form-item label="小程序原始id">
					<el-input v-model.trim="form.gh_id" class="max-w460"></el-input>
					<div class="tips">小程序管理后台，设置->账号信息->原始ID，以gh_ 开始</div>
				</el-form-item>
				<el-form-item label="webUrl">
					<el-input v-model.trim="form.web_url" class="max-w460"></el-input>
					<div class="tips">小程序链接失效访问的url</div>
				</el-form-item>
			</template>
			<template v-if="form.type == 3">
				<el-form-item label="下载地址">
					<el-input v-model.trim="form.down_url" class="max-w460"></el-input>
					<div class="tips">填写app下载地址，自己开发或者第三方下载地址</div>
				</el-form-item>
				<el-form-item label="关系绑定">
					<el-radio v-model="form.bind_type" :label="1">直接跳下载页，app里绑定</el-radio>
					<el-radio v-model="form.bind_type" :label="2">公众号授权后跳下载页</el-radio>
					<div class="tips">公众号授权后跳下载页需填写公众号相关信息</div>
				</el-form-item>
			</template>
			<!--提交-->
			<div class="common-button-wrapper">
				<el-button type="primary" @click="onSubmit">提交</el-button>
			</div>
		</el-form>
	</div>
</template>

<script>
	import AppSettingApi from '@/api/appsetting.js';

	export default {
		data() {
			return {
				/*form表单数据*/
				form: {
					type: 1,
					open_site: '',
					gh_id: '',
					web_url: '',
					down_url: '',
					bind_type: 1
				},
			};
		},
		created() {
			this.getData();
		},

		methods: {
			getData() {
				let self = this;
				AppSettingApi.appshareDetail({}, true)
					.then(data => {
						if (data.data.data != null) {
							self.form = data.data.data;
						}
					})
					.catch(error => {});

			},
			//提交表单
			onSubmit() {
				let self = this;
				let params = this.form;
				AppSettingApi.editAppShare(params, true)
					.then(data => {
						ElMessage({
							message: '恭喜你，设置成功',
							type: 'success'
						});
					})
					.catch(error => {

					});
			},
		}

	};
</script>

<style scoped>
	.tips {
		color: #ccc;
	}
</style>